/**
 * 动画相关工具类
 */

/**
 * 获取动画样式
 * @param {string} type 动画类型
 * @returns {Object} 动画样式对象
 */
export const getAnimationStyle = (type) => {
  const animations = {
    float: {
      animation: 'float 6s ease-in-out infinite',
    },
    fadeIn: {
      animation: 'fadeIn 0.3s ease',
    },
    slideIn: {
      animation: 'slideIn 0.3s ease',
    }
  }
  return animations[type] || {}
}

/**
 * 生成关键帧动画
 * @param {string} name 动画名称
 * @param {Object} keyframes 关键帧配置
 * @returns {string} CSS 动画字符串
 */
export const generateKeyframes = (name, keyframes) => {
  return `
    @keyframes ${name} {
      ${Object.entries(keyframes)
        .map(([key, value]) => `${key} { ${value} }`)
        .join('\n')}
    }
  `
}

/**
 * 添加过渡效果
 * @param {Object} element DOM元素
 * @param {string} animation 动画名称
 * @returns {Function} 清理函数
 */
export const addTransition = (element, animation) => {
  element.style.animation = animation
  const cleanup = () => {
    element.style.animation = ''
  }
  element.addEventListener('animationend', cleanup)
  return () => element.removeEventListener('animationend', cleanup)
} 